<template>
    <div>
        <el-descriptions title="编辑跟进" direction="vertical" :column="2" border style="margin-top: 20px">
            <template #extra>
                <el-button :type="!data.isEdit ? 'success' : 'primary'" @click="methods.update">
                    {{ data.isEdit ? "修改" : "编辑" }}</el-button>
            </template>
            <el-descriptions-item label="内容" :span="2">
                <el-tag v-if="!data.isEdit">{{ data.dorw.content }}</el-tag>
                <el-input type="textarea" v-if="data.isEdit" v-model="data.dorw.content" autosize :rows="2"
                    placeholder="请输入内容"></el-input>
            </el-descriptions-item>
            <el-descriptions-item label="跟进方式">
                <el-tag v-if="!data.isEdit">{{ data.dorw.followWayName }}</el-tag>
                <el-select v-model="data.dorw.followWay" v-if="data.isEdit" clearable placeholder="请选择跟进方式">
                    <el-option v-for="item in date.followWay" :key="item.id" :label="item.value" :value="item.id" />
                </el-select>
            </el-descriptions-item>
            <el-descriptions-item label="下次联系时间">
                <el-tag v-if="!data.isEdit">{{ data.dorw.nextConnectionTime }}</el-tag>
                <el-date-picker v-model="data.dorw.nextConnectionTime" v-if="data.isEdit" value-format="YYYY-MM-DD"
                    type="datetime" placeholder="选择日期" />
            </el-descriptions-item>
            <el-descriptions-item label="操作" :span="2">
                <el-button type="success" @click="methods.contvip">转换</el-button>
            </el-descriptions-item>
        </el-descriptions>
    </div>
</template>

<script setup lang="ts">
import { onMounted,reactive,defineEmits } from "vue";
import { ElMessage } from 'element-plus';
import { updateFollowOfflineCustomers,getFollowOfflineCustomersid } from '@/api/FollowOfflineCustomers/index';
import { getFollowWay } from '@/api/Dictionarys/index';

//跟进方式
interface FollowWay {
    id: string;
    value: string;
    dictionaryTypeId: string;
    createTime: string;
}
interface Date {
    followWay: FollowWay[];
}
const date = reactive<Date>({
    followWay: [],
});
let data = reactive({
    isEdit: false,
    dorw:[],
    content: "",
    followWay: "",
    customerId: "",
    nextConnectionTime: ""
});
const emit = defineEmits(['myclose','convert_vip']);
const methods={
    async bind(){
        const res = await getFollowWay();
        if (res.code === 0) {
            date.followWay = res.data.data;
        }
    },
    async binds(){
        const res = await getFollowOfflineCustomersid({
            id:sessionStorage.getItem("followid")
        });
        if (res.code === 0) {
            sessionStorage.clear();
            data.dorw = res.data.data[0];
        }
    },
    contvip(){
        emit('convert_vip');
    },
    async update(){
        if (!data.isEdit) {
            data.isEdit = true;
        } else {
            if (data.dorw.content.trim() === "") {
                ElMessage.error('跟进内容不允许为空')
                return;
            }
            if (data.dorw.nextConnectionTime.trim() === "") {
                ElMessage.error('下次联系时间不允许为空')
                return;
            }
            const res = await updateFollowOfflineCustomers({
                ...data.dorw
            });
            if (res.code === 0) {
                ElMessage.success(res.message);
                emit('myclose');
            } else {
                ElMessage.error(res.message);
            }
        }
    }
}
onMounted(() => {
    // data.id = route.params.id;
    methods.bind();
    methods.binds();
    // console.log(route.params.id)
});
</script>

<style scoped>
</style>